<template>
    <div class="equipSelectDialog">
        <el-dialog title="设备选择" class="menuDialog" width="500px" append-to-body :visible.sync="dialogVisible" :close-on-click-modal="false" center custom-class="equipSelect" :show-close="false">
            <span slot="title" class="dialog-footer dialogTitle">
                <span :class="{STTreeMenu: showSetParm}">设备选择</span>
                <span v-if="showSetParm">设备控制项选择</span>
            </span>

            <div :class="{treeMenuBox: true, STTreeMenu: showSetParm}">
                <el-input placeholder="请输入设备名称" v-model="searchName" @keyup.enter.native="onSearch" clearable>
                    <i slot="prefix" class="el-input__icon el-icon-search"></i>
                </el-input>
                <div class="main">
                    <div class="treeMenu" v-loading="equipLoading">
                        <treeMenu v-if="equipList.length > 0" :dataList="equipList" :selectedMode="selectedMode" :isCloseStatus="true" :equipSelected="equipSelected" :isPage="'dialog'" :getItem="showSetParm ? getItem : false" />

                        <div class="noData" v-if="equipList.length === 0">{{ noData }}</div>
                    </div>
                </div>
                <!-- <div class="pagination">
                    <el-pagination small :page-size="pageSize" layout="prev, pager, next" :total="total" :current-page="currentPage" @current-change="handleCurrentChange">
                    </el-pagination>
                </div> -->
            </div>
            <div class="equipSelectRight" v-if="showSetParm">
                <div class="setParmMain">
                    <div :class="{
                            setParm: true,
                            selectedColor: item.setNo == setParmCurrentIndex,
                        }" v-for="(item, index) in setParmList" :key="index" @click="selectedSetParm(item)">
                        {{ item.setNm }}
                    </div>
                    <div class="noData" v-if="setParmList.length === 0">{{ noData }}</div>
                </div>
                <div class="pagination">
                    <el-pagination small :page-size="setParmPageSize" layout="prev, pager, next" :total="setParmTotal" :current-page="setParmCurrentPage" @current-change="setParmHandleChange">
                    </el-pagination>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <div class="bottomBtn">
                    <el-button @click="selectedChange([])">取 消</el-button>
                    <el-button type="primary" @click="sendData">确 定</el-button>
                </div>
            </span>
        </el-dialog>
    </div>
</template>

<style lang="scss" src="./equipSelect.scss"></style>
<script src="./equipSelect.js"></script>